<%@ page contentType="text/html;charset=UTF-8" pageEncoding="UTF-8" isELIgnored="false" %>
<script>
$(function(){
  $("#dailyproductimagedatagrid").datagrid({
      url:'${pageContext.request.contextPath}/picture/findById?id=${param.id}',
      method:'post',
      fit:true,
      fitColumns:true,
      striped:true,
      remoteSort:false,
      checkOnSelect:false,
      toolbar:'#productImagetoolbar',
      onLoadSuccess:function(){
        $(".btn").linkbutton({
          plain:true
        })
      },
      columns:[[
          {field:'cks',checkbox:true},
          {title:'id',field:'id',align:'center',width:200},
          {title:'路径',field:'path',align:'center',width:200},
          {title:'商品id',field:'productid',align:'center',width:200},
        {title:'图片展示',field:'show',align:'center',width:200,formatter:function(index,row,value){
          return "<img src='${pageContext.request.contextPath}/"+row.path+"?time="+Math.random()+"' style='width:180px;height:150px'>"
        }},
        {title:'操作',field:'options',width:300,formatter:function(index,row,value){
          return "<a href='javascript:;' onclick=\"deleteImage('"+row.id+"')\"  class='btn' data-options=\"iconCls:'icon-remove'\">删除</a>"
        }}
      ]]
  })


    $("#btn").bind('click',function(){
        $("#uploadImageForm").form({
            url:'${pageContext.request.contextPath}/picture/save?productId=${param.id}',
            success:function(){
                $("#dailyproductimagedatagrid").datagrid('reload');
            }
        })
        $("#uploadImageForm").form('submit');
    })

});

//删除图片
function deleteImage(id){
    $.messager.confirm('删除提醒','确定要删除吗？？',function(r){
        if(r){
            $.post('${pageContext.request.contextPath}/picture/delete',{"id":id},function(result){
                showMessage("删除提示",result.message);
                $("#dailyproductimagedatagrid").datagrid('reload');
            })
        }
    })
}
</script>


<div id="cc" class="easyui-layout" style="width:100%;height:100%;">
  <div data-options="region:'east',iconCls:'icon-reload',title:'上传图片',split:true" style="width:30%;">
    <form id="uploadImageForm" method="post" enctype="multipart/form-data" style="text-align: center;margin-top: 200px">
      <input class="easyui-filebox" name="multipartFile" data-options="prompt:'choose image..',buttonText:'添加图片',buttonIcon:'icon-add',multiple:true,buttonAlign:'left',required:true" style="width: 200px">
      <br/>
      <a id="btn" href="javascript:;" class="easyui-linkbutton" data-options="iconCls:'icon-save'" style="margin-top: 20px">提交</a>
    </form>
  </div>
  <div data-options="region:'west',title:'展示所有关于该商品的图片',split:true" style="width:70%;">
    <table id="dailyproductimagedatagrid" ></table>
  </div>
</div>



<div id="productImagetoolbar">
  <a href="javascript:;" class="easyui-linkbutton" data-options="iconCls:'icon-remove',plain:true" onclick="deleteSome();">删除选中</a>
</div>